<template>
  <div class="online_service">
    <a href="https://dct.zoosnet.net/LR/Chatpre.aspx?id=DCT69917970&lng=cn" target="_blank" class="service">
      <img src="@/assets/images/service.png" alt="在线咨询" />
      <span>在线咨询</span>
    </a>
    <el-popover placement="right" trigger="hover">
      <div class="big_qrcode">
        <img src="@/assets/images/qrcode.jpg" alt="二维码" />
      </div>
      <div class="qr_code" slot="reference">
        <img src="@/assets/images/code.png" alt="二维码" />
      </div>
    </el-popover>
    <div class="back_top" @click="goTop">
      <img src="@/assets/images/back.png" alt="返回顶部" />
    </div>
  </div>
</template>
<script>
import { GET_SERVICE_PATH } from "@/http/interface";
import { Popover } from "element-ui";
export default {
  name: "OnlineService",
  components: {
    [Popover.name]: Popover,
  },
  data() {
    return {
      timeInterval: null,
    };
  },
  methods: {
    // 打开在线客服
    goService() {
      window.location.href = GET_SERVICE_PATH;
    },

    // 回到顶部
    goTop() {
      let _this = this;
      if (_this.timeInterval) {
        return false;
      }
      _this.timeInterval = setInterval(function () {
        let o = document.documentElement.scrollTop;
        if (o <= 0) {
          clearInterval(_this.timeInterval);
          _this.timeInterval = null;
          return false;
        }
        if (o > 0) {
          document.documentElement.scrollTop = o - 100;
        }
      }, 10);
    },
  },
};
</script>
<style lang="less" scoped>
@import "./index.less";
</style>